<template>
  <div class="wripper-introduce">
    <div class="title" v-if="title">{{ title }}</div>

    <div class="default">
      <slot>
        <h3>默认内容</h3>
      </slot>
    </div>

    <div class="view" v-if="view">
      {{ view }}
      <van-icon name="arrow" />
    </div>
  </div>
</template>

<script setup>
const props = defineProps({
  title: {
    type: String,
    default: "空",
  },
  view: {
    type: String,
    default: "",
  },
})
</script>

<style lang="less" scoped>
.wripper-introduce {
  .title {
    font-size: 16px;
    font-weight: 700;
    padding-bottom: 8px;
    border-bottom: 1px solid #f7f5f5;
  }
  .default {
    margin: 5px 0px;
  }
  .view {
    margin-top: 15px;
    display: flex;
    justify-content: flex-end;
    font-size: 12px;
    font-weight: 700;
    color: var(--primary-color);
  }
}
</style>
